<template>
  <div>
    <p>{{showNum}}</p>
    <button @click="btnSub">-1</button>
    <button @click="btnSubN">-N</button>
    <button @click="subAsync">异步 -1</button>
    <button @click="subNAsync(3)">异步 -N</button>
  </div>
</template>

<script>
  import { mapState, mapMutations, mapActions, mapGetters } from 'vuex'

  export default {
    data () {
      return {}
    },
    computed: {
      ...mapState(['count']),
      ...mapGetters(['showNum'])
    },
    methods: {
      ...mapMutations(['sub', 'subN']),
      ...mapActions(['subAsync', 'subNAsync']),
      btnSub () {
        this.sub()
      },
      btnSubN () {
        this.subN(5)
      }
    }
  }
</script>
